<template>
	<view>
		<view class="p-1 main-bg-color-hui">			
		</view>
		<view class="px-3">
			<view class="row j-sb a-center" style="border-bottom: 1upx solid #f6f6f6;">
				<view class="start">
					<text>头</text><text>像</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<image @tap="headavatar()" :src="userinfos.avatar" style="width: 70upx;height: 70upx;border-radius: 50%;"></image>
					<image @tap="headavatar()" src="../../static/rightcir.png" style="width: 37upx;height: 37upx;"></image>
				</view>
			</view>
			<view class="row j-start a-center" style="border-bottom: 1upx solid #f6f6f6;">
				<view class="start">
					<text>用</text><text>户</text><text>名</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<input type="text" v-model="userinfos.username" placeholder="请输入姓名" />
				</view>
			</view>
			<view class="row  j-start a-center" style="border-bottom: 1upx solid #f6f6f6;">
				<view class="start">
					<text>手</text><text>机</text><text>号</text><text>码</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<input type="text" v-model="userinfos.tel_phone" placeholder="请输入手机号" />
				</view>
			</view>
			<view class="row  j-start a-center" style="border-bottom: 1upx solid #f6f6f6;">
				<view class="start">
					<text>身</text><text>份</text><text>证</text><text>号</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<input type="text" v-model="userinfos.id_card" placeholder="请输入身份证号" />
				</view>
			</view>
			<view class="row j-sb a-center" style="border-bottom: 1upx solid #f6f6f6;">
				<view class="start">
					<text>性</text><text>别</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<radio value="1" :checked="userinfos.sex==1" @click="radio(1)">男</radio>
					<radio value="2" :checked="userinfos.sex==2" @click="radio(2)">女</radio>
				</view>
			</view>
			<view @tap="toAddress" class="row j-sb a-center" style="">
				<view class="start  py-2">
					<text>收</text><text>货</text><text>地</text><text>址</text>
				</view>
				<view class="row a-center py-2 ml_30">
					<image src="../../static/rightcir.png" style="width: 37upx;height: 37upx;"></image>
				</view>
			</view>
		</view>
		
		<view class="p-1 main-bg-color-hui mb-5">
		</view>
		<button  @click="confirm"  class="main-bg-color-cheng main-text-color-bai">提交</button>
	</view>
</template>

<script>
	import request from '@/common/lib/request.js'
	export default {
		data() {
			return {
				baseUrl:request.common.baseUrl,
				userinfos: {
					avatar:'',
					username: '',
					tel_phone: '',
					id_card: '',
					sex:0,
					address: ''
				}
				
			}
		},
		onLoad:function(){
			uni.setStorageSync('keyHeadavatar','')
			uni.request({
			    url: request.common.baseUrl+'/api/users/userinfos',
			    data: {
					token:uni.getStorageSync('keyToken')
				},
			    header: {
					'Content-Type':'application/json;charset=UTF-8',
					'Content-Type':'application/x-www-form-urlencoded'
			    },
			    success: (res) => {
					console.log(res)
			        if(res.data.code==200){
						this.userinfos=res.data.data
						this.userinfos.avatar=this.baseUrl+res.data.data.avatar
					}
			    }
			});
		},
		onShow:function(){
			if(uni.getStorageSync('keyHeadavatar')){
				this.userinfos.avatar=uni.getStorageSync('keyHeadavatar')
			}
		},
		methods: {
			toAddress() {
				uni.navigateTo({
					url:'../score/address'
				})
			},
			confirm(){
				if(uni.getStorageSync('keyHeadavatar')){
					uni.request({
						url: request.common.baseUrl+'/api/users/userEdit',
						data: {
							token:uni.getStorageSync('keyToken'),
							username:this.userinfos.username,
							tel_phone:this.userinfos.tel_phone,
							id_card:this.userinfos.id_card,
							sex:this.userinfos.sex,
							address:this.userinfos.address,
							avatar:uni.getStorageSync('keyHeadavatar')
						},
						header: {
							'Content-Type':'application/json;charset=UTF-8',
							'Content-Type':'application/x-www-form-urlencoded'
						},
						success: (res) => {
							if(res.data.code==200){
								uni.showToast({
									title: res.data.msg,
									icon: 'none',
									duration: 2000,
								})
								setTimeout(function () {
									uni.navigateBack({
										delta:1
									})
								}, 2000);
							}else{
								uni.showToast({
									title: res.data.msg,
									icon: 'none',
									duration: 2000,
								})
							}
						}
					})
				}else{
					uni.request({
						url: request.common.baseUrl+'/api/users/userEdit',
						data: {
							token:uni.getStorageSync('keyToken'),
							username:this.userinfos.username,
							tel_phone:this.userinfos.tel_phone,
							id_card:this.userinfos.id_card,
							sex:this.userinfos.sex,
							address:this.userinfos.address
						},
						header: {
							'Content-Type':'application/json;charset=UTF-8',
							'Content-Type':'application/x-www-form-urlencoded'
						},
						success: (res) => {
							if(res.data.code==200){
								uni.showToast({
									title: res.data.msg,
									icon: 'none',
									duration: 2000,
								})
								setTimeout(function () {
									uni.navigateBack({
										delta:1
									})
								}, 2000);
							}else{
								uni.showToast({
									title: res.data.msg,
									icon: 'none',
									duration: 2000,
								})
							}
						}
					})
				}
				
			},
			radio(e){
				this.userinfos.sex=e
			},
			headavatar(){
				uni.navigateTo({
					url: '/pages/membercenter/head?avatar='+this.userinfos.avatar
				})
			}
		}
	}
</script>

<style>
	.start {
		width: 120rpx;
		display: flex;
		justify-content: space-between;
	}
	.ml_30 {
		margin-left: 30rpx;
	}
</style>
